<div ng-show="vm.seen">
    <section class="box" style="padding-bottom: 0px;">
        <header class="panel_header">
            <h2 class="title pull-left">前{{vm.table.totals.length}}宝贝 数量-价格分布</h2>
        </header>
        <div class="content-body" style="padding: 0;height: 400px;">
            <div id="draw_attr_prod" echarts-draw-canvas-line style="height: 100%;width: 100%;"></div>
        </div>
    </section>
    <table class="responsive-table centered bordered" dw-loading="attr_product">
        <thead>
            <tr>
                <th>排名</th>
                <th class="pigTh">宝贝</th>
                <th>标题</th>
                <th>店铺</th>
                <th>品牌</th>
                <th ng-click="vm.sort('sellMoney','down')">
                    <span class="cp">近30天销售额</span>
                    <i class="caret down icon cp" ng-class="{'caret down icon cp':true,'green-text':vm.sortColumn == 'sellMoney'}"></i>
                </th>
                <th ng-click="vm.sort('sellAmount','down')">
                    <span class="cp">近30天销售量</span>
                    <i class="caret down icon cp" ng-class="{'caret down icon cp':true,'green-text':vm.sortColumn == 'sellAmount'}"></i>
                </th>
                <th>
                    <span>价格</span>
                    <!-- <i class="caret down icon cp" ng-class="{'caret down icon cp':true,'green-text':vm.filter.sortColumn == 'price'}"></i> -->
                </th>
                <th>监控数据</th>
                <th>货源</th>
                <th>监控</th>
            </tr>
        </thead>
        <tbody>
            <tr class="repeat-item" dir-paginate="prod in vm.table.products | itemsPerPage: 11" total-items="vm.table.count" pagination-id="attr_product_table">
            	<td ng-if="prod.numberId">{{prod.index}}</td>
                <td ng-if="prod.numberId">
                    <a href="https://item.taobao.com/item.htm?id={{prod.numberId}}" target="_blank">
                        <img ng-src="{{prod.picUrl}}" class="w65">
                    </a>
                </td>
                <td ng-if="prod.numberId">
                    <a class="truncate" style="max-width: 200px;overflow: hidden;" title="{{prod.title}}"href="https://item.taobao.com/item.htm?id={{prod.numberId}}" target="_blank" ng-bind-html="prod.title | highlight:vm.filter.title"></a>
                </td>
                <!-- 店铺 -->
                <td class="detailData cp" ng-if="prod.numberId" ng-click="vm.getShopBasic($event,$index)">
                    <a href="http://store.taobao.com/shop/view_shop.htm?user_number_id={{prod.uid}}" target="_blank">{{prod.nick}}</a>
                </td>
                <!-- 品牌 -->
                <td ng-if="prod.numberId && !prod.brandName">-</td>
                <td class="detailData cp" ng-if="prod.numberId && prod.brandName" ng-click="vm.getBrandBasic($event,$index)">
                    {{prod.brandName || '-'}}
                </td>
                <td ng-if="prod.numberId" class="hisData cp" dim="sellMoney" jq-popup popup-config="prod" popup-type="'product'" popup-dim="'sellMoney'">{{prod.sellMoney | bigNum}}</td>
                <td ng-if="prod.numberId" class="hisData cp" dim="sellAmount" jq-popup popup-config="prod" popup-type="'product'" popup-dim="'sellAmount'">{{prod.sellAmount | bigNum}}</td>
                <td ng-if="prod.numberId" class="hisData cp" dim="price" jq-popup popup-config="prod" popup-type="'product'" popup-dim="'price'">{{prod.price}}</td>
                <td ng-if="prod.numberId" title="点击查看历史数据" class="cp" ng-click="vm.getMonitorData($event,$index)">
                    <i class="line chart icon" style="font-size: 16px;"></i>
                </td>
                <td ng-if="prod.numberId" class="cp" emit-product-source emit-prod="prod">
                    <a href="javascript:void(0);">商品货源</a>
                </td>
                <td ng-if="prod.numberId" class="monitorTd" add-monitor add-monitor-config="prod" add-monitor-type="'product'">
                    <i class="toggle off icon cp" ng-class="{'toggle icon':true,'on':prod.collectionStatus,'off':!prod.collectionStatus}"></i>
                </td>
                <td ng-if="prod.monitorDetail" colspan="11">
                    <!-- 店铺详情 -->
                    <shop-stat-data-component shop-uid="prod.uid" ng-if="prod.uid"></shop-stat-data-component>
                    <!-- 品牌详情 -->
                    <brand-stat-data-component brand-name="prod.brandname" ng-if="prod.brandname"></brand-stat-data-component>
                    <!-- 日监控数据 -->
                    <monitor-day-component class="monitorDetail" target-id="prod.targetId" monitor-day-type="'product'" ng-if="prod.targetId"></monitor-day-component>
                </td>
            </tr>
        </tbody>
    </table>
    <div class="center-align pd10">
        <dir-pagination-controls on-page-change="vm.pageChanged(newPageNumber)" pagination-id="attr_product_table" boundary-links="true"></dir-pagination-controls>
    </div>
</div>
